Widgets Overview

The following is a run through of the widgets you can create with Interact. All widgets allow for the following keyword arguments:

label: Label to be shown next to the widget
value: The value the widget should be set to when created
signal: A signal object of type Reactive.Input which gets the value of the widget as user enters input.

Many of the widgets have keyword arguments specific to them. See below for more.



In [1]:

    
using Interact
using Reactive

Slider

Sliders are arguably the most useful of the widgets. A slider can be created with the slider{T <: Number}(range::Range{T}) function. The value of the slider defaults to the median of the range, and can be set using the value::T keyword argument. The type of signal a slider depends on the type of the range. E.g. A floating point range like 0:π/4:2π gives a signal of floating point values, while a range like 1:10 gives a signal of integers.



In [2]:

    
float_slider = slider(0:π/4:2π)









    Out[2]:



In [3]:

    
int_slider = slider(1:10)









    Out[3]:

Checkbox

checkbox takes an optional first argument which defaults to false and creates a checkbox.



In [4]:

    
display(checkbox())
checkbox(true)









    











    Out[4]:

Toggle

You can create a toggle button with togglebutton which takes as an optional argument its label.



In [5]:

    
status = togglebutton("Mary called", value=true)









    Out[5]:



In [6]:

    
lift(s -> s ? "Mary called" : "Mary didn't call", status)









    Out[6]:





"Mary called"

Button

A button gives out a signal of a constant signal which is nothing by default. You can set this using the value keyword argument. The signal updates when the button is clicked.



In [7]:

    
b = button("Click Me")









    Out[7]:

Here is how you can count the number of clicks made on a button using foldl on the signal:



In [8]:

    
foldl((acc, value) -> acc + 1, 0, signal(b))









    Out[8]:





0

Option widgets

There are 3 options widgets: dropdown, togglebuttons, radiobuttons. There are two types allowed as an argument while invoking these:

AbstractArray (e.g. Vector, Tuple)
Associative (e.g. Dict, OrderedDict) The default value is the first element (or undefined in case of an undordered Associative like Dict), but this can be set using the value keyword argument.



In [9]:

    
a = dropdown(["one", "two", "three"])









    Out[9]:



In [10]:

    
signal(a)









    Out[10]:





"one"



In [11]:

    
f = radiobuttons(["Add" => +, "Sub" => -, "Exp" => ^])









    Out[11]:



In [12]:

    
@lift f(e, π*im)









    Out[12]:





2.718281828459045 - 3.141592653589793im

Notice that the order "Add", "Sub", "Exp" was not retained in the above example, because a Dict does not save the ordering. To overcome this, we can use OrderedDict from DataStructures.jl package.



In [13]:

    
using DataStructures
f_ = togglebuttons([("Add", +), ("Sub", -), ("Exp", ^)])









    



Warning: using DataStructures.status in module Main conflicts with an existing identifier.






    Out[13]:

Textbox

A textbox can be of a Number or String type. textbox takes one argument: its default value.



In [14]:

    
string_box = textbox("Change me")









    Out[14]:



In [15]:

    
signal(string_box)









    Out[15]:





"Change me"

A textbox can be of a Number type as well. Just set a default number value, or use textbox(typ=T) where T is a Number type.



In [16]:

    
int_box = textbox(0)









    Out[16]:



In [17]:

    
signal(int_box)









    Out[17]:





0

If creating a number typed textbox, you can also pass along an optional range field to set a bound on the possible values one can input. If an entered value exceeds the range, it is replaced by its nearest bounding number.



In [18]:

    
bounded_float_box = textbox(2pi, range=-10.0:10)









    Out[18]:



In [19]:

    
signal(bounded_float_box)









    Out[19]:





6.283185307179586

Textarea

textarea takes an optional default value and creates a textarea. Its signal changes when you type.



In [20]:

    
tex = textarea("Your very own \$\\LaTeX\$ editor")









    Out[20]:



In [21]:

    
@lift latex(tex)









    Out[21]:

The `widget` Function

widget tries to coerce a value into a widget.



In [22]:

    
map(display, [
    widget(1:10),                 # Slider
    widget(false),                # Checkbox
    widget("text"),               # Textbox
    widget(1.1),                  # Number Textbox
    widget([:on, :off]),          # Toggle Buttons
    widget([:π => float(π), :τ => 2π])
    ]);